<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>层次选择器</title>
		<link rel="stylesheet" type="text/css" href="css/txt.css" />
		<script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>
	</head>

	<body>

		<div>
			<h1>www.baidu.com</h1>
		</div>
		<div>
			<h1>www.mldn.cn</h1>
			<span>玩玩</span>
		</div>
		<span class="temp">www.mldn.cn</span>
		<p class="temp">www.mldn.cn</p>
		<p>www.mldn.cn</p>

	</body>

	<script type="text/javascript">
		$(function() {
			// 选择全部div span的后代, 不管中间相隔几代
			//$("div span").attr("class","txt");
			// 另一种做法
			//$("div").find("span").attr("class","txt");
			// 选择直接后代
			//$("div>span").attr("class","txt");
			// 另一种选择直接后代
			// $("div").children("span").attr("class","txt");
			// 查询同一级的第一个元素
//			$("span").next("p").attr("class","txt");
			// 查询同一级的所有元素
			$("div").nextAll("p").attr("class","txt");
		});
	</script>

</html>